<template>
    <el-dialog close-on-press-escape draggable :close-on-click-modal="false" :modal="true" align-center destroy-on-close
        v-model="store.dialog.input.show" title="" width="800" style="height: auto;">
        <div style="margin-top: 10px;">{{ store.dialog.input.title }}</div>
        <el-input v-model="store.dialog.input.default" style="width: 100%;margin-top: 10px;"></el-input>
        <div v-if="store.dialog.input.error" style="margin-top: 10px;">{{ store.dialog.input.error }}</div>
        <div style="text-align: right;margin-top: 10px;" slot="footer" class="dialog-footer">
            <el-button v-if="store.dialog.input.showCancel" @click="async () => {
                await tool.flow(async () => {
                    store.hideInput()
                }, (err) => {
                    tool.toast.error(`${err}`)
                })
            }">取消</el-button>
            <el-button type="primary" @click="async () => {
                await tool.flow(async () => {
                    try {
                        store.dialog.input.check(store.dialog.input.default)
                    } catch (err) {
                        error = `${err}`
                        return
                    }
                    store.dialog.input.okCallBack(store.dialog.input.default)
                    store.hideInput()
                }, (err) => {
                    tool.toast.error(`${err}`)
                })
            }">确定</el-button>
        </div>
    </el-dialog>
</template>

<script setup>
import { ref, reactive, defineProps, computed, watch, onMounted, onBeforeUnmount } from 'vue';
import { useStore } from '../modules/store'
const store = useStore()
import tool from '../modules/tool'

onMounted(async () => {

})
</script>

<style scoped></style>